<template>
  <div class="app-container">
    <el-form ref="queryForm" label-width="110px">
      <el-form-item label="支付成功提醒">
        <el-switch v-model="config.emailFlag" :active-value="1" :inactive-value="0" />
      </el-form-item>
      <el-form-item label="发件邮箱">
        <el-select v-model="config.selectAct" placeholder="请选择模板类型" multiple clearable style="width: 500px">
          <el-option v-for="dict in accounts" :key="dict.id" :label="dict.account" :value="dict.id" />
        </el-select>
      </el-form-item>
      <el-form-item label="发件模板">
        <el-select v-model="config.selectTemp" placeholder="请选择模板类型" clearable style="width: 500px">
          <el-option v-for="dict in templates" :key="dict.templateId" :label="dict.name" :value="dict.templateId" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button v-loading="open" type="primary" icon="Setting" size="mini" @click="saveConfig">保存配置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { emailConfig, sageEmailConfig } from '@/api/email/EmailConfig';

export default {
  name: 'EmailConfig',
  data() {
    return {
      open: false,
      config: {
        emailFlag: 0,
        selectAct: [],
        selectTemp: ''
      },
      accounts: [],
      templates: []
    };
  },
  created() {
    this.getConfig();
  },
  methods: {
    saveConfig() {
      this.open = true;
      sageEmailConfig(this.config).then((response) => {
        this.$modal.msgSuccess('修改成功');
        this.open = false;
      });
    },
    getConfig() {
      emailConfig().then((response) => {
        this.config.emailFlag = response.data.emailFlag;
        this.accounts = response.data.accounts;
        this.templates = response.data.templates;
        this.config.selectAct = this.accounts.filter((tmp) => tmp.type === 1).map((tmp) => tmp.id);
        this.config.selectTemp = this.templates.filter((tmp) => tmp.status === 1).map((tmp) => tmp.templateId)[0];
      });
    }
  }
};
</script>
<style scoped lang="scss"></style>
